<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<link href="../../css/bootstrap.min.css?v=3.3.5" rel="stylesheet">
		<link href="../../css/font-awesome.min.css?v=4.4.0" rel="stylesheet">
		<link href="../../css/plugins/iCheck/custom.css" rel="stylesheet">
		<link href="../../css/animate.min.css" rel="stylesheet">
		<link href="../../css/style.min.css?v=4.0.0" rel="stylesheet">
		<base target="_blank">

		<script src="../../js/jquery.min.js?v=2.1.4"></script>
		<script src="../../js/bootstrap.min.js?v=3.3.5"></script>
		<script src="../../js/plugins/peity/jquery.peity.min.js"></script>
		<script src="../../js/content.min.js?v=1.0.0"></script>
		<script src="../../js/plugins/iCheck/icheck.min.js"></script>
		<script src="../../js/demo/peity-demo.min.js"></script>
        <script src="../../js/angular-1.4.2/angular.min.js"></script>
	</head>

	<body class="gray-bg" ng-app="systemRole" ng-controller="systemRoleCtrl">
		<div class="wrapper wrapper-content animated fadeInRight">
			<div class="row">
				<div class="col-sm-12">
					<div class="ibox float-e-margins">
						<div class="ibox-content">
							<div class="row">
								<div class="col-sm-2">
									<input type="text" placeholder="角色名称" class="input-sm form-control" ng-model="searchRole.name"> 
								</div>
								<div class="col-sm-2">
									<div class="btn-toolbar">
						              <button type="button" class="btn btn-sm btn-primary"><i class="glyphicon glyphicon-search"></i>搜索</button>
						              <button type="button" onclick="window.location.href='add.html'"  class="btn btn-sm btn-primary"><i class="glyphicon glyphicon-plus"></i>新增</button>
						           </div>
								</div>
							</div>
							<div class="table-responsive">
								<table class="table table-striped table-bordered table-hover">
									<thead>
										<tr>
											<th>角色名称</th>
											<th>排序</th>
											<th>创建时间</th>
											<th>操作</th>
										</tr>
									</thead>
									<tbody >
										<tr ng-repeat="role in roleList">
											<td>{{role.name}}</td>
											<td>{{role.sort}}</td>
											<td>{{role.createTime}}</td>
											<td class="project-actions">
												<a ng-click="roleUpdate(role.id)" href="#" class="btn btn-sm btn-info"><i class="glyphicon glyphicon-pencil"></i> 编辑</a>
												<a ng-click="roleDelete(role.id)" href="#" class="btn btn-sm btn-danger" ><i class="fa fa-times"></i>删除</a>
												<a ng-click="roleView(role.id)" href="#" class="btn btn-sm btn-default"><i class="glyphicon glyphicon-cog"></i>查看</a>
												<a href="#" class="btn btn-sm btn-warning"><i class="glyphicon glyphicon-lock"></i>授权</a>
											</td>
										</tr>
									</tbody>
								</table>
							</div>

						</div>

					</div>
				</div>

			</div>
		</div>
	</body>
<script>
var systemRole = angular.module('systemRole', []);
systemRole.controller('systemRoleCtrl', function($scope,$location) {
     $scope.roleList = [{
     	id:1,name:"行政",sort:"1",createTime:"2016-9-27 22:49:40"
     },{
     	id:2,name:"技术总监",sort:"2",createTime:"2016-9-27 22:49:41"
     },{
     	id:3,name:"总经理",sort:"3",createTime:"2016-9-27 22:49:42"
     }];
     $scope.searchRole={name:"行政11"};
     
     $scope.roleUpdate=function(id){
     	 $scope.roleList= [{
     	     id:1,name:"行政",sort:"1",createTime:"2016-9-27 22:49:40"
		     },{
		     	id:2,name:"技术总监",sort:"2",createTime:"2016-9-27 22:49:41"
		     },{
		     	id:3,name:"总经理",sort:"3",createTime:"2016-9-27 22:49:42"
		     },{
		     	id:4,name:"测试经理",sort:"4",createTime:"2016-9-27 22:49:42"
		     },{
		     	id:5,name:"开发人员",sort:"5",createTime:"2016-9-27 22:49:42"
		     }];
     };
     $scope.roleView=function(id){
     	 alert("跳转查看页面！");
     };
     
     $scope.roleDelete=function(id){
     	 $scope.roleList= [{
     	     id:1,name:"行政",sort:"1",createTime:"2016-9-27 22:49:40"
		 }];
     };
     
});

    </script>
</html>